<extend name="_Layout/main"/>

<block name="style">

</block>

<block name="jumbotron">
<!-- side content -->

    <script>
        //高亮导航
        try{
            var _cid="{$Think.get.cid}";
            if(_cid !=""){
                var nav_arr=_cid.split("_");
                //console.log(nav_arr);
                for(x in nav_arr){
                    //console.log(nav_arr[x]);
                    var _id="#nav_"+nav_arr[x];
                    $(_id).addClass("active");
                }
            }
        }catch(e){
            //console.log(e) //把报错个看看
        }
        // }
    </script>
<aside class="aside bg-light dk" id="sidebar">
    <section class="vbox animated fadeInUp">
        <section class="scrollable hover">
            <div id="two_nav" class="list-group no-radius no-border no-bg m-t-n-xxs m-b-none auto">
                <a href="{:U('Document/index', array('cid' => '32'))}" class="list-group-item <if condition='$__CURRENT_CATEGORY__'>active</if>" >
                    全部
                </a>
                <h5 style="color:#F05050;text-align:center;margin-top: 30px;">【 音乐类型选择 】</h5>
                <a href="" id="nav_0"  data-id="0" class="xxxssa list-group-item">
                    华语
                </a>
                <a href="" id="nav_1"  data-id="1" class="xxxssa list-group-item">
                    粤语
                </a>
                <a href="" id="nav_2"  data-id="2" class="xxxssa list-group-item">
                    欧美
                </a>
                <a href="" id="nav_3"  data-id="3" class="xxxssa list-group-item">
                    韩语
                </a>
                <a href="" id="nav_4"  data-id="4" class="xxxssa list-group-item">
                    小语种
                </a>
                <a href="" id="nav_5"  data-id="5" class="xxxssa list-group-item">
                    轻音乐
                </a>
                <a href="" id="nav_6"  data-id="6" class="xxxssa list-group-item">
                    民谣
                </a>
                <a href="" id="nav_7"  data-id="7" class="xxxssa list-group-item">
                    迷幻
                </a>
                <a href="" id="nav_8"  data-id="8" class="xxxssa list-group-item">
                    爵士
                </a>
                <a href="" id="nav_9"  data-id="9" class="xxxssa list-group-item">
                    流行
                </a>
                <a href="" id="nav_10"  data-id="10" class="xxxssa list-group-item">
                    孤独
                </a>
                <a href="" id="nav_11"  data-id="11" class="xxxssa list-group-item">
                    怀旧
                </a>
                <a href="" id="nav_12"  data-id="12" class="xxxssa list-group-item">
                    阳光
                </a>
                <a href="" id="nav_13"  data-id="13" class="xxxssa list-group-item">
                    安静
                </a>
                <a href="" id="nav_14"  data-id="14" class="xxxssa list-group-item">
                    慵懒
                </a>
            </div>
        </section>
    </section>
</aside>
    <script type="text/javascript">
        /*$("#two_nav span").click(function(){
            var cid= $(this).attr("cid");   //获取cid加入数组

            console.log("我是indexof："+__url.indexOf(cid));

            var length = __url.length;    //数组长度
            __url[cid] = cid; //url的cid等于获取到的cid

            console.log("我是数组arr："+__url+"------当前点击的cid是："+cid);

            var par="";
            for(var i in __url){
                if(!isNaN(i)){
                    par += i + "_";
                }
            };

            //拼接URL 放到href访问
            var url="/index.php?s=/document/music/cid/"+par+".html";    //拼接URL
            url=url.replace("_.",".");  //替换URL最后的下划线
            $(this).children("a").attr("href",url); //把拼接起来的url放到url访问
            console.log(url);
        });*/





     //   try{}
        //OK
       // Tclass();

        /*
        *   音乐筛选事件
        */
        $('a.xxxssa').click(function () {
            var id = $(this).data('id');
            //console.log("---------"+id);

            //循环
            arrHandler(id);

            //判断数组如何为空  就默认跳转
            if(!__Musicurl.length){
                var href = "/index.php?s=/document/index/cid/32.html";
                $(this).attr('href',href);
                return 0;
            };

            var param='';
            __Musicurl.forEach(function (val, index) {
                //param=false 假时   !param=true 就是真，取反，就执行param=val，否则执行param=param+'_'+val
                //!param?param=val:param=param+'_'+val;
                //如果param等于空或者真就执行param=val，否则执行param=param+'_'+val
                param===''?param=val:param=param+'_'+val;
                /*if(param==true){
                    param=val;
                }else{
                    param=param+'_'+val;
                }*/
            });

            var url='/index.php?s=/document/music/cid/'+param;
            $(this).attr('href',url);
        });
        function arrHandler(id){
            for (var i = 0; i < __Musicurl.length; i++) {
                if (__Musicurl[i] == id) {
                    return __Musicurl.splice(i, 1);
                }
            };
            __Musicurl.push(id);
        };
        //console.log(__Musicurl);


    </script>

<!-- / side content --></block>

<block name="main">
    <section>
        <section class="vbox">
            <section id="vbox" class="scrollable wrapper-lg">

                <!-- 文档列表页面顶部钩子 -->
                <div class="clearfix hook hook-document-list-before">
                    {:hook('DocumentListBefore')}
                </div>
                <!-- 文档列表 -->
                <div class="widget-1 widget-odd widget_music_post_widget widget">
                    <header class="list-page-header">
                        <a href="{:U('Document/add', array('cid' => '32'))}">
                            <h2 class="font-thin m-b m-t-none" style="float:left;">What’s Music</h2>
                            <h1 class="list-page-title">发布音乐</h1>
                        </a>
                    </header>

                    <div class="row row-sm" id="conttt">
                        <volist name="volist" id="vo">
                            <div class="col-xs-6 col-sm-4 col-md-3">
                                <article id="post-{$vo.id}" class="item post-{$vo.id} type-download status-publish has-post-thumbnail download_category-emotion download_tag-70 download_artist-71 odd edd-download edd-download-cat-emotion edd-download-tag-%e9%9b%aa%e6%a8%b1%e3%81%ae%e5%bf%83%e6%83%85">
                                    <div class="pos-rlt">
                                        <div class="cd_player">
                                            <img src="__IMG__/c1.png" class="r img-full wp-post-image" style="position: relative;z-index: 3">
                                            <i class="cd"></i>
                                            <i class="cd_bg"></i>
                                        </div>

                                        <div class="opacity r bg-black" style="width: 77%">
                                               <img style="width: 77%;height: 96%;position: absolute;top: 0;z-index: 4" src="{$vo.cover|get_cover='Music'}" class="r img-full wp-post-image" alt="{$vo.main_field}">
                                        </div>
                                        <a href="javascript:;" data-id="{$vo.id}" class="play-me">
                                            <div class="item-overlay opacity r bg-black" style="width: 77%;height: 96%;z-index: 5;">
                                                <div class="center text-center m-t-n">
                                                    <i class="icon-control-play i-2x text"></i>
                                                    <i class="icon-control-pause i-2x text-active"></i>
                                                </div>
                                                <div class="bottom padder m-b-sm">
                                                    <div data-docid="{$vo.id}" class="pull-right collect">
                                                        <i class="fa {:W('Home/document/isDocCollect',array($__USER__['uid'],$vo['id']))}" style="color:red;"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                    <php>$userinfo=M('User')->find($vo['uid']);$info['username']=$userinfo['username'];</php>
                                    <div class="m-t-sm m-b-lg item-desc" style="margin-top: 0px;">
                                        <p title="{$vo.main_field}" style="margin:0 0 0px;">{$vo.main_field}</p>
                                        <div class="text-muted text-xs text-ellipsis">by <a href="{:U('User/home/uid/'.$vo['uid'])}" rel="tag">{$info.username}</a></div>
                                    </div>
                                </article>
                            </div>
                        </volist>
                    </div>
                </div>
                <!-- Main End -->
                <ul class="pagination">{$page}</ul>

                <!-- 文档列表页面底部钩子 -->
                <div class="clearfix hook hook-document-list-after">
                    {:hook('DocumentListAfter')}
                </div>
            </section>
        </section>
    </section>



</block>
